<template>
	<su-popup :show="show" type="center" round="25" :isMaskClick="false">
		<view class="update ss-p-y-44">
			<image class="update-img" src="https://xyh-static-app.oss-cn-hangzhou.aliyuncs.com/storage_2/13mansion/update/pet.png"></image>
			<view class="title ss-font-32 ss-p-x-36">版本更新</view>
			<view class="version ss-font-26 ss-m-t-16 ss-p-x-36">V{{data.version.split('').join('.')}}</view>
			<view class="update-title">更新内容</view>
			<view class="content ss-p-x-46 ss-m-t-10" v-html="data.content"></view>
			<view class="update-btn ss-p-x-38 ss-flex justify-between">
				<view class="left" @click="close">下次再说</view>
				<view class="right" @click="update">立即更新</view>
			</view>
		</view>
	</su-popup>
</template>

<script setup>
	import {
		computed,
		reactive
	} from 'vue';
	import {
		onLoad,
	} from '@dcloudio/uni-app';
	import sheep from '@/sheep';
	import $platform from '@/sheep/platform';

	const data = computed(() => sheep.$store('app').updateData)
	const show = computed(() => sheep.$store('app').updatePopShow)


	const close = () => {
		const app = sheep.$store('app')
		app.$patch((state) => {
			state.updatePopShow = false
		})
	}

	const update = () => {
		const app = sheep.$store('app')
		app.$patch((state) => {
			state.updatePopShow = false
		})
		if ($platform.os === 'android') {
			if ($platform.device.deviceBrand === 'huawei') {
				let appid = "com.rchz.liuliangbenben"; // 包名
				let url = `market://details?id=${appid}`
				plus.runtime.openURL(url);
			} else {
				// 下载wgtUrl的文件
				var dtask = plus.downloader.createDownload(sheep.$url.cdn(data.value.apk_url), {}, function(d, status) {
					uni.showToast({
						title: '下载完成',
						mask: false,
						duration: 2000
					});
					// 下载完成  安装 force 一定要设置为true，更新完成后 重启应用
					if (status == 200) {
						plus.runtime.install(plus.io.convertLocalFileSystemURL(d.filename), {
								force: true
							},
							function() {
								plus.runtime.restart();
							},
							function(error) {
								uni.showToast({
									title: '安装失败-01',
									mask: false,
									duration: 1500
								});
							})
					} else {
						uni.showToast({
							title: '更新失败',
							mask: false,
							duration: 1500
						});
					}
				});
				try {
					dtask.start(); // 开启下载的任务
					var prg = 0;
					var showLoading = plus.nativeUI.showWaiting("正在下载");
					//创建一个showWaiting对象
					dtask.addEventListener('statechanged', function(task, status) {
						// 给下载任务设置一个监听 并根据状态  做操作
						switch (task.state) {
							case 1:
								showLoading.setTitle("正在下载");
								break;
							case 2:
								showLoading.setTitle("已连接到服务器...");
								break;
							case 3:
								prg = parseInt((parseFloat(task.downloadedSize) / parseFloat(task.totalSize)) *
									100);
								showLoading.setTitle("  正在下载" + prg + "%  ");
								break;
							case 4:
								plus.nativeUI.closeWaiting();
								//下载完成
								break;
						}
					});
				} catch (err) {
					plus.nativeUI.closeWaiting();
					uni.showToast({
						title: '更新失败',
						mask: false,
						duration: 1500
					});
				}
			}
		} else {
			uni.downloadFile({
				url: sheep.$url.cdn(data.value.apk_url),
				success: (downloadResult) => {
					plus.runtime.install(downloadResult.tempFilePath, {
							force: true
						},
						function() {
							plus.runtime.restart();
						});
				}
			});
		}
	}
</script>

<style lang="scss" scoped>
	view {
		box-sizing: border-box;
	}

	.update {
		width: 560rpx;
		height: 614rpx;
		position: relative;

		.update-img {
			position: absolute;
			left: 0;
			top: -60rpx;
			width: 561rpx;
			height: 323rpx;
		}

		.title {
			text-align: right;
			font-weight: 500;
			color: #FFFFFF;
			position: relative;
		}

		.version {
			text-align: right;
			font-weight: 500;
			color: #FFFFFF;
			position: relative;
		}

		.update-title {
			font-size: 32rpx;
			font-weight: bold;
			color: #5F5F5F;
			margin-top: 150rpx;
			padding: 0 46rpx;
		}

		.content {
			// max-height: 100rpx;
			display: -webkit-box;
			-webkit-box-orient: vertical;
			-webkit-line-clamp: 2;
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: pre-wrap;
		}

		.update-btn {
			margin-top: 60rpx;

			view {
				width: 225rpx;
				height: 86rpx;
				border-radius: 43rpx;
			}

			.left {
				border: 2rpx solid #14C89F;
				font-family: PingFangSC;
				font-size: 30rpx;
				font-weight: normal;
				line-height: 86rpx;
				text-align: center;
				color: #14C89F;
			}

			.right {
				background: #14C89F;
				font-family: PingFangSC;
				font-size: 30rpx;
				font-weight: normal;
				line-height: 86rpx;
				text-align: center;
				color: #FFFFFF;
			}
		}
	}
</style>